ページ全体の枠を作成する
先週はスタイルシートを変更することで枠線を描画する方法を説明しました。この ほかにもBODYタグのスタイルシートを利用したテクニックは、まだまだあります。今 週はページ全体に枠を作成する方法を紹介してみましょう。

→ BODYタグのスタイルシートを用意する
 
前回の講座と同様に、まずはSTYLEタグでスタイルシートを宣言し、続いてBODYタグのスタイルシートを変更するための準備を行います。なお、ページ全体に枠を作成した場合、Internet Explorerではスクロールバーが枠の内側に、Netscapeではスクロールバーが枠の外側に表示されます。
<STYLE type="text/css">
<!--
body {

}
-->
</STYLE>


→ ページの枠を指定する
 
次に、ページ全体の枠線を指定していきます。枠線の太さは「border-width:」で、色は「border-color:」で指定することができます。また「border-style:」を使って線の種類を変更することも可能です。これらの設定方法は『魅せるホームページ作成講座』の第57回「CSSで枠線を描画(1)」と同じですので、参考としてみてください。
<STYLE type="text/css">
<!--
body {
      border-width:20px;
      border-color:#000088;
      border-style:solid;
}
-->
</STYLE>


→ 余白の指定を行う
 
通常の枠線と同様に、枠線とページ内容の余白を「padding:」により指定することも可能です。ただし、「margin:」により枠線の外側の余白を指定することはできません。「padding:」の設定方法は『魅せるホームページ作成講座』の第58回「CSSで枠線を描画(2)」と同じですので、参考としてみてください。
<STYLE type="text/css">
<!--
body {
      border-width:50px;
      border-color:#339900;
      border-style:outset;
      padding:20px;
}
-->
</STYLE>


yVoC[UNLIMIT1~] ECir|C Yahoo yV LINEf[^[z500~`I


z[y[W NWbgJ[h COiq O~yz COsI COze